<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" href="css/jeedle.generic.css" type="text/css" />

	<meta http-equiv="content-type" content="type=text/html; charset=utf-8;" />		
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<link rel="shortcut icon" href="../favicon.ico"> 
	<link rel="stylesheet" type="text/css" href="css/style.css" />
	<link rel="stylesheet" type="text/css" href="css/style2.css" media="all"/>
	<link rel="stylesheet" type="text/css" href="css/jquery.jscrollpane.css" media="all" />
	
		
	<link rel="shortcut icon" href="img/favicon3.ico">
	<title>Jeedle Labs</title>
	
</head>
<body>
	<div id="container">
		<div id="header">
			<img src="img/jeedlelogo2.png" width="190" height="50"/>
		</div>

		<div id="content">
		
			<a href="#">
				<div id="show-portfolio-button">
					<p>Our projects</p>
				</div>
			</a>
			
			<a href="#">
				<div id="show-contact-form-button">
					<p>Contact us</p>
				</div>
			</a>
			
			<div id="main-slide">
				<div class="slide-logo">
					<img src="img/logo2.jpg" />
				</div>
				<div class="rotating-text"> 
					<div class="rw-wrapper">
						<h2 class="rw-sentence">
							<span>Jeedle Labs</span>
							<br />
							<span>Creating</span>
							<div class="rw-words rw-words-2">
								<span>ideas</span>
								<span>technology</span>
								<span>solutions</span>
								<span>innovation</span>
							</div>
							<br />
							<span>Reaching</span>
							<div class="rw-words rw-words-2">
								<span>further</span>
								<span>boundaries</span>
								<span>customers</span>
								<span>beyond</span>
							</div>
						</h2>
					</div>
				</div>
			</div>
			
			<div id="ca-container" class="ca-container" >
				<div class="ca-wrapper">
					<div class="ca-item ca-item-1">
						<div class="ca-item-main">
							<div class="ca-icon"></div>
							<h3><strong>NAHE</strong></h3>
							<h4>
								<span>Not another HTML editor (Nahe) is a our first published android 
								application as the name says it is a HTMlL editor with save file, open 
								file, tag autocomplete and webviewer features.
								</span>
							</h4>
								<a href="#" class="ca-more">...</a>
						</div>
						<div class="ca-content-wrapper">
							<div class="ca-content">
								<h6><strong>NAHE</strong></h6>
								<a href="#" class="ca-close">close</a>
								<div class="ca-content-text">
									<p>Not another HTML editor (Nahe) is a our first published android
										application as the name says it is a HTMlL editor with save file,
										open file, tag autocomplete and webviewer features.
									</p>
									<p>The files can be
										saved in a user specified location inside the phone to be retreive
										later and keep editing or show to a friend the design the user built
										using NAHE using the webviewer or even the default browser of the
										user's phone.
									</p>
								</div>
								<ul>
									<li><a href="https://play.google.com/store/apps/details?id=com.jeedle.nahe&hl=en">Go to website</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="ca-item ca-item-2">
						<div class="ca-item-main">
							<div class="ca-icon"></div>
							<h3><strong>Golden Rod Builder</strong></h3>
							<h4>
								<span>A simple company website describing the main characteristics and services it provides.</span>
							</h4>
								<a href="#" class="ca-more">...</a>
						</div>
						<div class="ca-content-wrapper">
							<div class="ca-content">
								<h6><strong>Golden Rod Builder</<strong></h6>
								<a href="#" class="ca-close">close</a>
								<div class="ca-content-text">
									<p>Golden Rod Builder is an electromechanical equipment company that provides services in the Dominican Republic.</p>
									<p>The website contains the main information about the company and organizes it into categories or tabs.</p>
								</div>
								<ul>
									<li><a href="http://www.goldenrodbuilder.com/">Go to website</a></li>
								</ul>
							</div>
						</div>
					</div>
					
				</div>
			</div>

			<div class="contact-form-container">
				<div id="contact-form">
					<form>
						<a href="#" class="cancel-button-link">
							<div id="cancel-message-button" class="cancel-button">X</div>
						</a>
						<br>
						<br>

						<div>
							<input type="text" name="name" placeholder="Name">
						</div>
						<div>
							<input type="text" name="email" placeholder="Email">
						</div>
						<div>
							<input type="text" name="phone" placeholder="Phone (Optional)">
						</div>
						<br>
						<div>
							<textarea id="message-area" type="text" name="message" placeholder="Message"></textarea>
						</div>
						<br>
						<br>
						<div href="#" class="submit-button-section">
							<input type="submit" class="submit-button" value="Send" style="cursor: pointer;" >
						</div>
					</form> 
				</div>
			</div>
		
		</div>

	</div>
	<div id="footer">
		<img class="footer-logo" src="img/logo2.jpg" width="60" height="60" />
		<h1 class="create-reach">Create... Reach...</h1>
		<h1 class="follow-us">Follow us!!!</h1>
		<ul class="social_bookmarks">
			<li class='facebook'>
				<a href='https://www.facebook.com/jeedle.labs'>
					<img src="img/facebook-footer-icon.png" width="20" height="20"/>
					<div class="social-text"> &nbsp; facebook.com/jeedle.labs</div>
				</a>
			</li>
			<li class='twitter'>
				<a href='https://twitter.com/JeedleLabs'>
					<img src="img/twitter-footer-icon.png" width="20" height="20" />
					<div class="social-text"> &nbsp; @JeedleLabs</div>
				</a>
			</li>
		</ul>
	</div>
	

	<script type="text/javascript" src="js/modernizr.custom.72111.js"></script>
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
	<!-- the jScrollPane script -->
	<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
	<script type="text/javascript" src="js/jquery.contentcarousel.js"></script>
	<script type="text/javascript">
		$('#ca-container').contentcarousel();
	</script>
	
	
	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
	<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	<script type="text/javascript">
	$(document).ready(function() {
		$('.ca-container').hide();
		$('.ca-container').css("visibility", "visible");
		$('.contact-form-container').hide();
		$('.contact-form-container').css("visibility", "visible");
		$('#show-portfolio-button').click(function() {
			$('.ca-container').slideToggle('slow');
		});
		$('#show-contact-form-button').click(function() {
			$('.contact-form-container').toggle( "slide", { direction: "right", duration: 500 } );
		});

		$('#cancel-message-button').click(function() {
			$('.contact-form-container').toggle( "slide", { direction: "right", duration: 500 } );
		});		
		
		
	});
	
	</script>


	
</body>
</html>